<template>
	<view class="content">
		<view class="box-bg_"></view>
		<view class="state-box">
			<image src="../../static/pay.png" mode=""></image>
			<view class="text">
				<view class="">
					支付成功
				</view>

				<view class="">
					随后可在您的房产中查看支付记录和收据
				</view>
			</view>
		</view>
		<view class="card">
			<view class="return-btn">
				返回
			</view>

			<view class="">
				请等待收据核查完成后维修资金将计入您的分户账户中
			</view>
		</view>
		
		<Loading/>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.content {
		padding: 0 20rpx;
		background-color: #F5F5F5;
		min-height: 100vh;

		.box-bg_ {
			position: absolute;
			top: 0;
			left: 0;
			width: 100vw;
			height: 886rpx;
			background-image: linear-gradient(to bottom, #4C77FA, #537CFA, #FFFFFF);
		}
	}

	.state-box {
		display: flex;
		margin-left: 76rpx;
		position: relative;
		z-index: 9;
		margin-top: 200rpx;
		margin-bottom: 70rpx;

		image {
			width: 137rpx;
			height: 120rpx;
			margin-right: 20rpx;
		}

		font-weight: 700;
		color: #ffffff;

		.text {
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			font-size: 32rpx;

			view:nth-child(2) {
				font-size: 24rpx;
			}
		}
	}

	.card {
		padding: 0 20rpx;
		padding-top: 130rpx;
		height: calc(100vh - 520rpx);

		font-size: 28rpx;
		color: #333333;

		.return-btn {
			width: 232rpx;
			height: 74rpx;
			border-radius: 40rpx;
			line-height: 74rpx;
			text-align: center;
			background-color: #456FFD;
			color: #ffffff;
			font-size: 28rpx;
			margin: 0 auto 34rpx auto;
		}
	}
</style>
